Skip to content

fix(resource): prevent permission-gated breadcrumb items from flashing on load#4732

Merged
waleedlatif1 merged 4 commits into
stagingfrom
improvement/kb-connectors-design-review
May 23, 2026
Merged

fix(resource): prevent permission-gated breadcrumb items from flashing on load#4732
waleedlatif1 merged 4 commits into
stagingfrom
improvement/kb-connectors-design-review

Conversation

@waleedlatif1
Copy link
Copy Markdown
Collaborator

Summary

  • Fix breadcrumb dropdown items in files and KB detail flashing in/out during permission hydration
  • Keep permission-gated items always rendered during the loading window (disabled), so no structural DOM change occurs once permissions resolve

Type of Change

  • Bug fix

Testing

Tested manually

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

…undant description suffix

- Fix icon colors to use --text-icon token across connector cards and modal
- Switch Reconnect/Update access buttons from active to primary variant
- Lift search box surface from --surface-2 to --surface-3 so it's visible against modal bg
- Replace raw <button> elements with emcn Button in base.tsx
- Shrink Connected Sources modal from lg to md
- Strip " to/into/from your knowledge base" from all 27 connector descriptions to prevent overflow
@vercel
Copy link
Copy Markdown

vercel Bot commented May 23, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped May 23, 2026 7:34pm

Request Review

@cursor
Copy link
Copy Markdown

cursor Bot commented May 23, 2026

PR Summary

Low Risk
Small UI-state fixes: adjusts permission hook loading semantics and tightens context-menu event listener cleanup; minimal surface area but could affect gating/disable states during initial load.

Overview
Prevents permission-gated UI from briefly rendering/vanishing by treating the auth session as part of the useUserPermissions loading state (sessionLoading now contributes to isLoading and blocks permission resolution until the session email is available).

Also tightens ResourceTable context-menu cleanup by removing the keydown listener immediately when Escape is pressed before clearing the menu state.

Reviewed by Cursor Bugbot for commit b96b7e7. Configure here.

@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps Bot commented May 23, 2026

Greptile Summary

This PR eliminates the permission-gated breadcrumb flash by keeping dropdown items in the DOM during the session/permission hydration window (rendered as disabled) rather than unmounting and remounting them once permissions resolve. It also fixes the root cause in useUserPermissions by including isPending from useSession in the isLoading calculation so the loading state correctly covers the window where the session hasn't surfaced an email yet.

  • use-user-permissions.ts: isPending: sessionLoading is now destructured from useSession and combined into isLoading: permissionsLoading || sessionLoading; sessionLoading is added to the useMemo dependency array.
  • base.tsx / files.tsx: Permission-gated breadcrumb items and the "New connector" header action are now always rendered while isLoading is true, with disabled: !canEdit preventing interaction; dependent useMemo arrays are updated accordingly.
  • resource.tsx: Adds contextMenuRowId state to track which row has its context menu open, surfacing it as isContextMenuTarget for row highlight and clearing via a self-removing Escape handler or pointerdown outside.

Confidence Score: 5/5

Safe to merge — the changes are narrowly scoped to loading-state guards and disabled props that are already handled by the component layer.

The core hook change correctly composes two independent loading flags, the DropdownMenuItem implementation applies pointer-events-none when data-disabled is set so disabled items cannot fire their onClick handlers, and the dependency arrays in both useMemo callbacks are kept in sync with the new value. No new API calls, no schema changes, and no side-effect paths are touched.

No files require special attention.

Important Files Changed

Filename Overview
apps/sim/hooks/use-user-permissions.ts Added sessionLoading from useSession().isPending to the isLoading guard and memo deps, closing the window where permissions were cached but session email was not yet resolved
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx Breadcrumb dropdown items and "New connector" header action now include userPermissions.isLoading in the render guard and disabled: !userPermissions.canEdit to stay mounted-but-inert during hydration; also minor UI cleanups (Button variants, modal size)
apps/sim/app/workspace/[workspaceId]/files/files.tsx Same isLoading guard applied to the folder breadcrumb "Rename" dropdown item; userPermissions.isLoading added to useMemo dependency array
apps/sim/app/workspace/[workspaceId]/components/resource/resource.tsx Adds contextMenuRowId state to track the open context-menu row, surfaces it as isContextMenuTarget to DataRow for background highlight, and clears it on Escape (self-removing handler) or pointerdown outside
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/connectors-section/connectors-section.tsx Connector icon color updated from text-secondary to text-icon; "Reconnect" button variant changed from active to primary for visual consistency

Sequence Diagram

sequenceDiagram
    participant Page
    participant useUserPermissions
    participant useSession
    participant Breadcrumb

    Page->>useUserPermissions: call(workspacePermissions, permissionsLoading)
    useSession-->>useUserPermissions: "{ data: null, isPending: true }"
    useUserPermissions-->>Page: "{ isLoading: true, canEdit: false }"
    Page->>Breadcrumb: "dropdownItems with disabled=true (items visible but inert)"

    Note over useSession: Session resolves
    useSession-->>useUserPermissions: "{ data: { user: { email } }, isPending: false }"
    useUserPermissions-->>Page: "{ isLoading: false, canEdit: true/false }"

    alt "canEdit = true"
        Page->>Breadcrumb: "dropdownItems with disabled=false (items become clickable)"
    else "canEdit = false"
        Page->>Breadcrumb: "dropdownItems=[] (items removed, no prior flash)"
    end
Loading

Reviews (2): Last reviewed commit: "fix(resource): self-remove keydown liste..." | Re-trigger Greptile

Comment thread apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx
@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@greptile

@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@cursor review

Copy link
Copy Markdown

@cursor cursor Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit b96b7e7. Configure here.

@waleedlatif1 waleedlatif1 merged commit 1286519 into staging May 23, 2026
14 checks passed
@waleedlatif1 waleedlatif1 deleted the improvement/kb-connectors-design-review branch May 23, 2026 19:40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant